<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <!-- 主表单区域 -->
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <!-- v-if="window.localStorage.getItem('state') == '新增'" -->
          <a-col :span="12">
            <a-form-model-item label="所属系统" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="belongSystem">
              <!-- <a-input v-model="model.belongSystem" placeholder="请输入所属系统"></a-input> -->
              <a-select
                @focus="handleFocusBelongSystem"
                allowClear
                v-model="model.belongSystem"
                placeholder="请选择所属系统"
              >
                <a-select-option
                  v-for="item in belongSystemList"
                  :key="item.value"
                  :value="item.text"
                  :label="item.text"
                >
                  {{ item.text }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="反馈部门" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="feedbackDepartment">
              <a-input readOnly v-model="model.feedbackDepartment" placeholder="请输入反馈部门"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="提问人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="questioner">
              <a-input readOnly v-model="model.questioner" placeholder="请输入提问人"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="问题类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="problemType">
              <!-- <a-input v-model="model.problemType" placeholder="请输入问题类型"></a-input> -->
              <a-select @focus="handleFocusBelongSystem" allowClear v-model="model.problemType">
                <a-select-option
                  v-for="item in problemTypeList"
                  :key="item.value"
                  :value="item.text"
                  :label="item.text"
                >
                  {{ item.text }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col>
            <a-form-model-item label="问题描述" :labelCol="labelCol1" :wrapperCol="wrapperCol1" prop="problemDesc">
              <j-editor v-model="model.problemDesc" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="window.localStorage.getItem('state') == '编辑'">
            <a-form-model-item label="解决方案" :labelCol="labelCol1" :wrapperCol="wrapperCol1" prop="solution">
              <j-editor v-model="model.solution" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="附件" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="enclosure">
              <j-upload v-model="model.enclosure"></j-upload>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="指派人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="assigner">
              <!-- <a-input v-model="model.assigner" placeholder="请输入指派人"></a-input> -->
              <a-select @focus="handleFocusAssigner" allowClear v-model="model.assigner">
                <a-select-option
                  v-for="item in assignerList"
                  :key="item.id"
                  :value="item.realname"
                  :label="item.realname"
                >
                  {{ item.realname }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <!-- <a-col :span="12">
            <a-form-model-item label="反馈日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="feedbackDate">
              <j-date
                placeholder="请选择反馈日期"
                v-model="model.feedbackDate"
                :show-time="true"
                date-format="YYYY-MM-DD HH:mm:ss"
                style="width: 100%"
              />
            </a-form-model-item>
          </a-col> -->
          <a-col :span="12">
            <a-form-model-item label="反馈状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
              <!-- <a-input-number
                v-model="model.status"
                placeholder="请输入反馈状态(1.未开始2.进行中3.已完成4.关闭)"
                style="width: 100%"
              /> -->
              <a-select allowClear v-model="model.status">
                <a-select-option value="未开始"> 未开始 </a-select-option>
                <a-select-option value="进行中"> 进行中 </a-select-option>
                <a-select-option value="已完成"> 已完成 </a-select-option>
                <a-select-option value="已关闭"> 已关闭 </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
    <!-- 子表单区域 -->
    <a-tabs v-model="activeKey" @change="handleChangeTabs" v-show="window.localStorage.getItem('state') == '编辑'">
      <a-tab-pane tab="需求评论" :key="refKeys[0]" :forceRender="true">
        <j-editable-table
          :ref="refKeys[0]"
          :loading="requirementCommentsTable.loading"
          :columns="requirementCommentsTable.columns"
          :dataSource="requirementCommentsTable.dataSource"
          :maxHeight="300"
          :disabled="formDisabled"
          :rowNumber="true"
          :rowSelection="true"
          :actionButton="true"
        />
      </a-tab-pane>
    </a-tabs>
  </a-spin>
</template>

<script>
import { getAction, postAction } from '@/api/manage'
import { JVXETypes } from '@/components/jeecg/JVxeTable'
import { FormTypes, getRefPromise, VALIDATE_NO_PASSED } from '@/utils/JEditableTableUtil'
import { JEditableTableModelMixin } from '@/mixins/JEditableTableModelMixin'
import { validateDuplicateValue } from '@/utils/util'

export default {
  name: 'ChDemandFeedbackForm',
  mixins: [JEditableTableModelMixin],
  components: {},
  data() {
    return {
      // 指派人
      assignerList: [],
      // 所属系统
      belongSystemList: [],
      // 问题类型
      problemTypeList: [],
      // 子表指派人
      options: [
        // { text: 'aa', value: '张三' },
        // { text: 'bb', value: '李四' },
      ],
      aa: '李德港',
      window,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      labelCol1: {
        xs: { span: 24 },
        sm: { span: 3 },
      },
      wrapperCol1: {
        xs: { span: 24 },
        sm: { span: 18 },
      },
      model: {
        // feedbackDepartment:undefined,
        // belongSystem:undefined
        // 反馈状态
        status:'未开始'
      },
      // 新增时子表默认添加几行空数据
      addDefaultRowNum: 1,
      validatorRules: {},
      refKeys: ['requirementComments'],
      tableKeys: ['requirementComments'],
      activeKey: 'requirementComments',
      // 需求评论
      requirementCommentsTable: {
        loading: false,
        dataSource: [],
        columns: [
          {
            title: '评论内容',
            key: 'comments',
            type: FormTypes.input_pop,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: '',
          },
          {
            title: '附件',
            key: 'enclosure',
            type: FormTypes.file,
            token: true,
            responseName: 'message',
            width: '200px',
            placeholder: '请选择文件',
            defaultValue: '',
          },
          {
            title: '指派人',
            key: 'assigner',
            type: FormTypes.select,
            // options: [
            //   { text: '谷雨', value: '谷雨' },
            //   { text: '徐建国', value: '徐建国' },
            //   { text: '潘祥江', value: '潘祥江' },
            //   { text: '彭志荣', value: '彭志荣' },
            //   { text: '杨向向', value: '杨向向' },
            //   { text: '李德港', value: '李德港' },
            //   { text: '陈文东', value: '陈文东' },
            //   { text: '陈依婷', value: '陈依婷' },
            // ],
            options: localStorage.getItem('options')?JSON.parse(localStorage.getItem('options')):'',
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: '',
          },
          {
            title: '评论人',
            key: 'reviewer',
            type: FormTypes.input,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: localStorage.getItem('feedRecord')?JSON.parse(localStorage.getItem('feedRecord')).questioner:''
            // JSON.parse(localStorage.getItem('userInfo')).realname 
          },

          {
            title: '评论时间',
            key: 'commentTime',
            type: FormTypes.datetime,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: '',
            disabled:true
          },
          {
            title: '反馈内容',
            key: 'feedbackContent',
            type: FormTypes.input_pop,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: '',
          },
          {
            title: '反馈时间',
            key: 'feedbackTime',
            type: FormTypes.datetime,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: '',
            disabled:true
          },

          // {
          //   title: '需求反馈id',
          //   key: 'chDemandFeedbackId',
          //   type: FormTypes.input,
          //   width:"200px",
          //   placeholder: '请输入${title}',
          //   defaultValue:'',
          // },
        ],
      },
      url: {
        add: '/ch/chDemandFeedback/add',
        edit: '/ch/chDemandFeedback/edit',
        queryById: '/ch/chDemandFeedback/queryById',
        requirementComments: {
          list: '/ch/chDemandFeedback/queryRequirementCommentsByMainId',
        },
      },
    }
  },
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false,
    },
  },
  computed: {
    formDisabled() {
      return this.disabled
    },
  },
  created() {
    console.log('222')
    console.log(this)
    
    if (localStorage.getItem('state') == '新增') {
      postAction('/ch/chDemandFeedback/getDepartMentByUserName').then((res) => {
      if (res.code == 200) {
        this.model.questioner = res.result.loginUser.realname
        this.model.feedbackDepartment = res.result.departNames
      }
      console.log('res:', res)
    })
    }
    
  },
  mounted() {
     // 指派人获取焦点事件
     this.handleFocusAssigner()
  },
  methods: {
    // 指派人获取焦点事件
    handleFocusAssigner() {
      getAction('/ch/chSysProblemAllocation/queryLoginUsersByDeptId').then((res) => {
        if (res.code == 200) {
          this.assignerList = res.result
          let _this = this
          res.result.forEach(function (value, key) {
            var obj = {}
            obj.text = value.realname
            obj.value = value.realname
            _this.options.push(obj)
            // console.log("this",this);
            console.log(value.realname, key)
          })
          console.log('this.options', this.options)
          localStorage.setItem('options', JSON.stringify(this.options))
          console.log("999",JSON.parse(localStorage.getItem('options')));
          console.log('this.assignerList', this.assignerList)
          
        }
        console.log('queryLoginUsersByDeptId--res', res)
      })
    },
    //所属问题获取焦点事情
    handleFocusBelongSystem() {
      getAction('/ch/chSysProblemAllocation/queryDistListByCode').then((res) => {
        if (res.code == 200) {
          console.log('res', res)
          this.belongSystemList = res.result.system_code
          this.problemTypeList = res.result.problem_type
          // console.log("this.assignerList",this.assignerList);
        }
        console.log('queryLoginUsersByDeptId--res', res)
      })
    },
    addBefore() {
      console.log(111)
      this.requirementCommentsTable.dataSource = []
    },
    getAllTable() {
      let values = this.tableKeys.map((key) => getRefPromise(this, key))
      return Promise.all(values)
    },
    /** 调用完edit()方法之后会自动调用此方法 */
    editAfter() {
      this.$nextTick(() => {})
      // 加载子表数据
      if (this.model.id) {
        let params = { id: this.model.id }
        this.requestSubTableData(this.url.requirementComments.list, params, this.requirementCommentsTable)
      }
    },
    //校验所有一对一子表表单
    validateSubForm(allValues) {
      return new Promise((resolve, reject) => {
        Promise.all([])
          .then(() => {
            resolve(allValues)
          })
          .catch((e) => {
            if (e.error === VALIDATE_NO_PASSED) {
              // 如果有未通过表单验证的子表，就自动跳转到它所在的tab
              this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
            } else {
              console.error(e)
            }
          })
      })
    },
    /** 整理成formData */
    classifyIntoFormData(allValues) {
      let main = Object.assign(this.model, allValues.formValue)
      return {
        ...main, // 展开
        requirementCommentsList: allValues.tablesValue[0].values,
      }
    },
    validateError(msg) {
      this.$message.error(msg)
    },
  },
}
</script>

<style scoped>
</style>